import panel from './panel.vue'
const HAZARDS_LEVELS = [
  "evaluation_level_one",
  "evaluation_level_two",
  "evaluation_level_three",
  "evaluation_level_four"
];
const HAZARDS_LEVELS_FILL = ["red", "orange", "yellow", "blue"];
const RISK_LEVELS = ["1级", "2级", "3级", "4级"];
const RISK_LEVELS_NAMES = ["一级风险", "二级风险", "三级风险", "四级风险"];

const source = {
  collectionName: "sys_grid",
  options: { limit: 1000, include: ["areaManager"] }
}
const layer = {
  layout: "svg",
  infoWindow: {
    component: panel,
    title: () => "网格基本信息"
  },
  marker: {
    layout: "polygon",
    coordinate: "points",
    zoom: "zoomRange",
    normalStyle: {
      default: {},
      hazards(prop) {
        if ([3, 4].indexOf(prop.gridLevel) === -1) return {};
        let level = (prop.hazards && prop.hazards.level) || {};
        let index = HAZARDS_LEVELS.findIndex(v => !!level[v]);
        return index > -1 ? { fill: HAZARDS_LEVELS_FILL[index] } : {};
      },
      risk(prop) {
        if ([3, 4].indexOf(prop.gridLevel) === -1) return {};
        let level = (prop.risk && prop.risk.level) || {};
        let index = RISK_LEVELS.findIndex(v => !!level[v]);
        return index > -1 ? { fill: HAZARDS_LEVELS_FILL[index] } : {};
      }
    },
    rule() {
      if (this.activeLayerList.indexOf("hazards") > -1) {
        return "hazards";
      } else if (this.activeLayerList.indexOf("risk") > -1) {
        return "risk";
      } else {
        return "default";
      }
    }
  },
  tagging: {
    layout: "text",
    text: "name"
  }
}

export default {
  sources: { grid: source },
  layers: { grid: layer }
}
